module MC {
	export module msg {
		export function show(txt: string) {
			var wrap = document.createElement('div');
			$(wrap).css({
				'position': 'fixed',
				'top': '50%',
				'left': '50%',
				'transform': 'translate(-50%,-50%)',
				'-webkit-transform': 'translate(-50%,-50%)',
				'max-width': '50%',
				'padding': '.2rem .4rem',
				'color': 'white',
				'z-index': '20',
				'background': 'rgba(0,0,0,0.7)',
				'border-radius': '.08rem',
				'display': 'none',
				'font-size': '14px'
			});
			$(wrap).html(txt);
			$('body').append($(wrap));
			$(wrap).fadeIn();
			setTimeout(function () {
				$(wrap).fadeOut(function () {
					$(wrap).remove();
				});
			}, 1500);
		}
		export function alert(text: string, fun: Function = null) {
			let html = $(` 
			<div class="msgbody"> 
			<div class="msgBox">
				<div class="boxcon">`+ text + `</div>
				<div class="butarray clearfix"> 
					<a class="button closebtn buttonputong">关闭</a>
				</div>
			</div></div>`);
			html.find('.closebtn').click(() => {
				html.remove();
				fun && fun();
			});
			$('body').append(html);
		}

		/*** 带有确认按钮的消息框 */
		export function confirm(text: string, fun: Function) {
			let html = $(` 
			<div class="msgbody"> 
			<div class="msgBox">
				<div class="boxcon">`+ text + `</div>
				<div class="butarray clearfix">
					<a class="button savebtn">确定</a>
					<a class="button closebtn buttonputong">关闭</a>
				</div>
			</div></div>`);
			html.find('.savebtn').click(() => {
				fun();
				html.remove();
			});
			html.find('.closebtn').click(() => {
				html.remove();
			});
			$('body').append(html);
		}



		/*** 带有输入框图片上传窗口 */
		export function Pic(fun: Function, tip: string = '未命名') {
			let html = $(`
							<div class="msgbody">
							<div class="msgBox">
							<div class="boxcon">请上传新的图片</div>
							<div class="picUpDiv">
								<div class="fileDiv">
									<input type="file">
								</div>
								<div class="inputdiv">
									<span class="name">请输入图片标题:</span>
									<label class="inputLabel">
										<input type="radio" name="tipDivradio" value="" style="display: none"/>
										<input type="text" placeholder="新增图片" class="picname"/>
									</label>
									<div class="tipDiv">
										<span class="tip">推荐图片标题</span>
										<ul class="ulselect clearfix"> 
										</ul>

									</div>

								</div>
							</div>

							<div class="butarray clearfix">
								<a class="button savebtn">确定</a>
								<a class="button closebtn buttonputong">关闭</a>
							</div>
							</div>
						</div>
					
					`);
			let files1 = html.find('.fileDiv [type=file]');
			let imgSrc = '';
			MC.API.bindFileUp(files1, (src: string) => {
				html.find('.fileDiv').css('background-image', 'url("' + src + '")');
				imgSrc = src;
			});

			/**
			 *  
			 */
			if (tip !== '') {
				let tiplist = tip.split(',');
				for (let i = 0; i < tiplist.length; i++) {
					let str = tiplist[i];
					let li = `<li>
									<label>
										<input type="radio" name="tipDivradio" value="`+ str + `"/>
										<span>`+ str + `</span>
									</label>
								</li>`;
					html.find('.tipDiv .ulselect').append(li);
				}
			} else {
				html.find('.tipDiv').hide();
			}
			html.find('.picname').on('click', () => {
				html.find('.inputLabel [name=tipDivradio]').click();
			});
			html.find('.inputdiv .ulselect li').on('click', function () {
				let str = $(this).find('[type=radio]').val();
				html.find('.picname').val(str);
			});




			html.find('.savebtn').click(() => {
				let name = html.find('.picname').val();
				if (name == '') {
					msg.alert("图片标题必须填写");
					return;
				}
				if (imgSrc == '') {
					msg.alert("还未上传图片");
					return;
				}
				fun({
					src: imgSrc,
					name: name
				});
				html.remove();
			});
			html.find('.closebtn').click(() => {
				html.remove();
			});
			$('body').append(html);
		}

		/** 
		 * 带有标签选择编辑的窗口
		 */
		export function selsctTag(tagArray: string, fun: Function) {
			let html = $(`
				<div class="msgbody">
					<div class="msgBox">
						<div class="boxcon boxtitle">添加或者删除标签</div>
						<div class="tagDiv">
							<ul class="ul"> 
							</ul>
						</div>
						<div class="butarray clearfix">
							<a class="button savebtn">确定</a>
							<a class="button closebtn buttonputong">关闭</a>
						</div>
					</div>
				</div>
			
			`);

			let tArray = tagArray.split(',');
			for (let i = 0; i < tArray.length; i++) {
				let li = $(`<li class="clearfix">
									<span class="span">`+ tArray[i] + `</span>
									<a class="deleteico"></a>
				</li>`);
				html.find('.tagDiv .ul').append(li);
			}

			html.on('click','.tagDiv .ul li .deleteico',function(){
				let obj=$(this).parent();
				obj.remove();
			});

			let add = $(`<div class="addDiv clearfix">
									<input type="text" value="" class="text"/>
									<span class="button addspan">添加</span>
			</div>`);
			html.find('.tagDiv ').append(add);
			html.find('.addspan').on('click',()=>{
				let text=html.find('.addDiv .text').val();
				if(text==''){
					msg.alert('必须输入内容');return;
				}
				let obj=$('.msgbody .tagDiv .ul li .span');
				let list=[];
				for(let i=0;i<obj.length;i++){
					list.push($(obj[i]).text());
				}
				if(list.indexOf(text)!=-1){
					msg.alert('存在重复值');return;
				}

				let li = $(`<li class="clearfix">
									<span class="span">`+text + `</span>
									<a class="deleteico"></a>
				</li>`);
				html.find('.tagDiv .ul').append(li);
				html.find('.addDiv .text').val('');
			});

			html.find('.savebtn').click(() => {
				let obj=$('.msgbody .tagDiv .ul li .span');
				let list=[];
				for(let i=0;i<obj.length;i++){
					list.push($(obj[i]).text());
				}
				fun(list.join(','));
				html.remove();
			});
			html.find('.closebtn').click(() => {
				html.remove();
			});
			$('body').append(html);
		}




		/** 打开放大滑动图片 */
		export function Image(current:string,urls:Array<string>=[]){
				/** 
				    var obj = {
						urls : urls,
						current : current
					};
					previewImage.start(obj);
				 */
				if(urls.indexOf(current)==-1){
					urls.push(current);
				}

				current=MC.API.toBigPic(current);
				for(let i=0;i<urls.length;i++){
					urls[i]=MC.API.toBigPic(urls[i]);
				}
				previewImage.start({
					urls:urls,
					current:current
				});
		}


		export function showLoad(){
			if($('.loadDiv_showLoad')[0]){
				return;
			}
			let html=`<div class="loadDiv loadDiv_showLoad">
				<p class="loadp">加载中...</p>
			</div>`;
			$('body').append(html);
		}
		export function hideLoad(){
			$('.loadDiv_showLoad').remove();
		}

	}
}